<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>图片截取</title>
  <script src="./screenshot.js"></script>
  <style type="text/css">
  	.drawArea{
  		border: 1px solid #4fb8e3;
  		background:rgba(255,255,255,.5);
  		position: absolute;
  		z-index: 1000;
  	}
  </style>
</head>
<body>
	<div style="position: absolute;"><a href="javascript:cut();">截取，base64编码请看控制台</a></div>
    <canvas id="mycanvas">
		<p>你的浏览器不支持Canvas请更换成Chrome浏览器</p>
	</canvas>
	<script type="text/javascript">
		screenshot.constructor(document.getElementById('mycanvas'),{
			sourceImg:'http://img.hb.aicdn.com/38d8f519b3f464a80d85ed9632fed904ed0181f41d632-ZHrigO_fw658',
			width:document.body.offsetWidth,
			height:document.documentElement.clientHeight-50,
			drawAreaArray : [
				[800,83,462,102],
				[100,50,141,60],
			]
		});
		function cut(){
			screenshot.getImagePortion(document.getElementById('mycanvas'));
		}
	</script>
</body>
</html>
